<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
    <title>google map flashMarker</title>
    <link rel="stylesheet" href="css/style.css">
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAlCwS_WywshhKgi26S4kEZ_21efMvk9-c"></script>
    <script type="text/javascript" src="js/dat.gui.js"></script>
</head>

<body>
    <div id="map"></div>
    <script type="text/javascript" src="../build/google-map-flashMarker.js"></script>
    <script type="text/javascript">
        var map = new google.maps.Map(document.getElementById("map"), {
            zoom: 6,
            center: new google.maps.LatLng(29.063677, 112.03956)
        });

        var citys = [{
            name: '北京',
            lnglat: ['116.3', '39.9'],
            color: '#5070FF',
            type: 'circle',
            speed: 0.5,
        }, {
            name: '上海',
            lnglat: ['121.29', '31.11'],
            color: '#6EE7FF',
            type: 'ellipse',
            speed: 1,
            max: 40,
        }, {
            name: '福建',
            lnglat: ['117.984943', '26.050118'],
            color: '#90EE90',
            type: 'circle',
            speed: 0.45,
        }, {
            name: '广东',
            lnglat: ['113.394818', '23.408004'],
            color: '#f8983a',
            type: 'circle',
            speed: 0.9,
        }, {
            name: '广西',
            lnglat: ['108.924274', '23.552255'],
            color: '#FAFA32',
            type: 'ellipse',
            speed: 0.8,
            max: 50,
        }];

        var flashMarkerLayer = new FlashMarker(map, citys);
    </script>
</body>

</html>